Afficher une vidéo
Depuis HTML5, un lecteur vidéo est utilisable facilement grâce à la balise "video" :
<video controls loop autoplay muted>
<source src="exemple.mp4" type="video/mp4">
<source src="exemple.ogg" type="video/ogg">
<p>Texte lu si la balise video n'est pas supportée par le navigateur</p>
</video>
La balise vidéo peut avoir plusieurs attributs :
- controls : Permet à l'utilisateur de pouvoir contrôler la vidéo (lecture/pause, etc...)
- muted : Le son sera coupé par défaut au chargement de la page
-
autoplay : La vidéo se lancera toute seule dès le chargement de la page
Attention ne fonctionnera pas sur la majorité des navigateurs si l'attribut "muted" n'est pas spécifié aussi - loop : La vidéo sera jouée en boucle
Il faut toujours fournir plusieurs formats différents de la même vidéo car tous les navigateurs ne supportent pas tous les formats vidéos !
Si plusieurs sources sont définies, automatiquement le navigateur chargera le format qu'il préfère.
Si du texte est écrit en dessous des sources dans la balide "video", il ne sera affiché que si le navigateur ne supporte pas cette balise (vieux navigateurs par exemple)
Jouer un son
Idem que pour la balise "video", la balise "audio" existe depuis HTML5 et permet de jouer un son :
<audio controls autoplay loop muted>
<source src="exemple.mp3" type="audio/mpeg">
<source src="exemple.ogg" type="audio/ogg">
<p>Texte lu si la balise audio n'est pas supportée par le navigateur</p>
</audio>
Les attributs de la balise "audio" fonctionnent comme ceux de la balise "video" (controls, autoplay, loop, muted).